<template>
	<view class="center">
		<!--头部用户信息-->
		<view class="avatar_box">
			<open-data class="avatar" type="userAvatarUrl" default-avatar="https://dev.stall.lkxlkf.com/ca/icons/default/default-icon.png"></open-data>
			<open-data class="nickname" type="userNickName"></open-data>
		</view>
		<u-cell-group >
			<u-cell icon="setting-fill" title="个人设置" bgColor="#fff"></u-cell>
			<u-cell icon="integral-fill" title="我的内容" bgColor="#fff" value="新消息" @click="$utils.run('../content/contentList')"></u-cell>
			<!-- <u-cell icon="setting-fill" title="联系作者" @click="openAuthor"></u-cell> -->
		</u-cell-group>
		<!-- <u-modal :show="authorShow" title="你好-朋友" content='微信:bxh217'></u-modal> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				authorShow: false
			};
		},
		methods: {
			//打开联系作者
			openAuthor() {
				this.authorShow = true;
			},
			//主菜单点击
			homeMenuClick(index) {

			},
			//列表菜单点击
			listMenuClick(index) {
				uni.navigateTo({
					url: this.listMenu[index].url
				})
			}
		},
	}
</script>

<style lang="scss">
	page {
		height: 100%;
	}

	.center {
		padding-top: 30vh;
	}

	.profily,
	.profily_header {
		border-radius: 20rpx;
	}

	.center {
		height: 100%;

		&_top {
			height: 350rpx;
			background-color: $uni-bg-color;
			background-size: cover;
		}

		&_box_bg {
			background: #F9F9F9;
			position: relative;

			.profily {
				position: absolute;
				width: 90%;
				margin: 0 auto;
				top: -110rpx;
				left: 5%;
				background: #FEFEFE;
				padding: 35rpx;
				box-sizing: border-box;
				box-shadow: 1rpx 2rpx 16rpx 1rpx rgba(107, 107, 107, 0.1);
			}
		}
	}

	.home_menu {
		position: relative;
		display: flex;
		justify-content: space-around;

		.cell {
			width: 250rpx;
			font-size: 24rpx;
			text-align: center;
			display: flex;
			flex-direction: column;

			.img {
				width: 80rpx;
				height: 80rpx;
				margin: 0 auto;
				margin-bottom: 5rpx;
			}

			text {
				line-height: 20rpx;
				margin-top: 20rpx;
			}

			.special {
				border-left: 3rpx solid #CCCCCC;
				border-right: 3rpx solid #CCCCCC;
			}
		}
	}

	.arc {
		background-color: $uni-bg-color;
		height: 100rpx;
	}

	.within_arc {
		background-color: #FFFFFF;
		border-top-left-radius: 20%;
		border-top-right-radius: 20%;
		height: 100rpx;
	}

	.list_menu {
		width: 100%;
		display: inline-block;

		.row {
			font-size: 28rpx;
			letter-spacing: 1rpx;
			padding: 30rpx 5%;
			background: #FEFEFE;
			border-bottom: 1rpx solid #EEEEEE;
			overflow: hidden;
			box-sizing: border-box;
			display: flex;
			align-items: center;
			position: relative;

			text:nth-of-type(1) {
				margin-left: 20rpx;
				width: 80%;
			}

			image {
				width: 40rpx;
				height: 40rpx;
			}

			&:nth-of-type(4) {
				margin-top: 10rpx;
			}
		}
	}
</style>
